<template>
    <div class="view_tracker_recycling">
        <card title="传感器回收">
            <template #actions>
                <el-select class="w-32" v-model="queryBy">
                    <el-option v-for="(val, key) in queryBySth" :key="key" :value="key" :label="val" />
                </el-select>
                <el-input
                    class="w-48"
                    v-model="queryString"
                    :placeholder="placeholder"
                    prefix-icon="el-icon-search"
                    clearable
                />
                <el-button type="primary" @click="recycleTrackers">回收录入</el-button>
            </template>
            <template #default>
                <el-table :data="tableData">
                    <el-table-column type="index" label="#" align="center" />
                    <el-table-column prop="buyerName" label="买家账号" />
                    <el-table-column prop="sellerName" label="店铺名称" />
                    <el-table-column prop="orderSn" label="销售单号" />
                    <el-table-column prop="vid" label="传感器vid" />
                    <el-table-column prop="integration" label="积分" />
                    <el-table-column prop="managerName" label="管理员" />
                    <el-table-column prop="createTime" label="创建时间" />
                </el-table>
            </template>
            <template #bottom-right>
                <el-pagination
                    @current-change="query"
                    :currentPage.sync="currentPage"
                    :total="total"
                    :pageSize="pageSize"
                />
            </template>
        </card>
    </div>
</template>

<script>
import { getQueryOptions } from '../../mixins';

export default {
    data() {
        return {
            tableData: [],

            queryBy: 'vid',
        };
    },

    mixins: [
        getQueryOptions({
            apiurl: '/yxl/platform/findTrackerRecycle',
            paginable: true,
            params: {
                queryString: 'queryBy',
            },
        }),
    ],

    computed: {
        // 按某物查询
        queryBySth() {
            return {
                vid: '传感器vid',
                orderSn: '销售单号',
            };
        },

        // 占位符
        placeholder() {
            return `按${this.queryBySth[this.queryBy]}查询`;
        },

        // 跟踪器回收状态
        trackerRecyclingStatus() {
            return {
                1: { text: '待补货', tagType: 'warning' },
                2: { text: '已补货', tagType: 'success' },
            };
        },
    },

    methods: {
        // 回收跟踪器
        recycleTrackers() {
            this.$prompt('传感器vid', '回收录入', {
                closeOnPressEscape: false,
                closeOnClickModal: false,
                inputPattern: /^8\d{14}$/,
                inputErrorMessage: 'vid必须是以8开头的15位数字',
            })
                .then(({ value: vid }) => {
                    this.$put('/yxl/platform/recoveryInput', { vid }).then(this.query);
                })
                .catch(() => {});
        },
    },
};
</script>